const path = require("path");
const HtmlWebpackPlugin = require("html-webpack-plugin")
const CopyWebpackPlugin = require("copy-webpack-plugin")


//先写入口 和出口配置 开发环境  下载各种插件，配置插件
module.exports = {
    //入口配置
    entry: path.resolve(__dirname, "../src/index.js"),

    //出口配置  
    output: {
        path: path.resolve(__dirname, "../build"),
        filename: "./js/main.js",
        publicPath: "/"
    },


    //loader的配置
    // module: {
    //     rules: [{
            //我们刚开始路由渲染的html的类型，需要使用html-loader
            // test: /\.html$/i,
            // use: [
            //     //use中loader加载是有顺序的，先下后上，注意有的loader需要按照顺序书写
            //     'html-loader'
            // ]
    //ejs的loader
    module: {
        rules: [
            {
            test: /\.ejs$/i,
            loader: "ejs-loader",
            options: {
                variable: "data",
            }
        }
    ]
},        




    //插件配置
    plugins: [
        //生成html文件，并设置对应的参照模板
        new HtmlWebpackPlugin({
            filename: "index.html", 
            template: path.resolve(__dirname, '../public/index.html')
        }),

        //复制public文件到打包目录，忽略index.html
        new CopyWebpackPlugin({
            patterns: [{
                from: path.resolve(__dirname, "../public"),
                to: "public",
                globOptions: {
                    ignore: ["**/index.html"]
                }
            }],
        })
    ],

    resolve: {
        //配置路径别名
        alias: {
            $v: path.resolve(__dirname, "../src/views") 
        },
        extensions: [".js", ".json", ".ejs"]
    },


    //模式  生产环境
    mode: "production"
}